﻿@model CommentDTO[]
@{
    ViewBag.Title = "List";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<section class="layui-larry-box">
    <div class="larry-personal">
        <div class="layui-tab">
            <blockquote class="layui-elem-quote comments_search">
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-normal commentsAdd_btn">添加评论</a>
                </div>
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-danger batchDel">批量删除</a>
                </div>
                <div class="layui-inline">
                    <div class="layui-form-mid layui-word-aux">本页面刷新后除新添加的文章外所有操作无效，关闭页面所有数据重置</div>
                </div>
                <div class="layui-inline">
                    <span class="layui-form-mid">共有<span style="font-weight: bold"> @Model.Count() </span>条数据</span>
                </div>
            </blockquote>

            <!-- 操作日志 -->
            <div class="layui-form comments_list">
                <input type="hidden" id="Commentcount" name="count" value="@Model.Count()" />
                <table class="layui-table">
                    <colgroup>
                        <col width="10%">
                        <col>
                        <col>
                        <col>
                        <col>
                        <col>
                    </colgroup>
                    <thead>
                        <tr>
                            <th>
                                <input name="" lay-skin="primary" lay-filter="allChoose" id="allChoose" type="checkbox">
                                <div class="layui-unselect layui-form-checkbox" lay-skin="primary">
                                    <i class="layui-icon"></i>
                                </div>
                            </th>
                            <th>评论内容</th>
                            <th>评论星级</th>
                            <th>商品名称</th>
                            <th>用户名称</th>
                            <th>订单号</th>
                            <th>评论图片</th>
                            <th>操作</th>
                        </tr>
                    </thead>

                    <tbody class="comments_content" id="com">



                        <tr v-for="c in comments">
                            <td>
                                <input name="checked" lay-skin="primary" lay-filter="choose" type="checkbox">
                                <div class="layui-unselect layui-form-checkbox" lay-skin="primary">
                                    <i class="layui-icon"></i>
                                </div>
                            </td>
                            <td>{{c.content}}</td>
                            <td>{{c.Content}}</td>
                            <td>1</td>
                            <td>2</td>
                            <td>1</td>
                            <td><a href="#">查看</a></td>
                            <td>
                                <a class="layui-btn layui-btn-mini comments_edit"><i class="iconfont icon-edit"></i> 编辑</a>
                                <a class="layui-btn layui-btn-danger layui-btn-mini comments_del" data-id="1">
                                    <i class="layui-icon"></i> 删除
                                </a>
                            </td>
                        </tr>

                    </tbody>
                </table>
                <div class="larry-table-page clearfix">
                    <div id="page" class="page"></div>
                </div>
            </div>

        </div>
    </div>

</section>

@section FooterScript{

    <script src="https://cdn.bootcss.com/vue/2.3.3/vue.min.js"></script>

    <script type="text/javascript">
    // 定义一个变量用来存储分页数
    var count = 0;
        $(function () {

            $.ajax({
                type: "post",
                url: "/Comment/List2?index=" + curr,
                success: function (data) {
                    var app = new Vue({
                        el: "#app",
                        data: {
                            persons: data
                        },

                    })
                },
                error: function () {

                }
            })
        })








        // 获取总数据条数，然后除10，得到的就是页数
        count = parseInt(Math.ceil( @ViewBag.totalCount/ 10));

    })


    var appConfig = {
        name: "comments",    //需要和页面名称对应
        title: "评论",    //显示的名称
        addUrl: "permissionAdd.html",   //添加弹框的路径
        editUrl: "permissionEdit.html",      //修改弹框的路径

        //批量删除Ajax
        batchDel: function (data) {     //Array data 得到的是 需要删除的id
            data.each(function (index,value) {
                console.log(value);

                //todo:在此处添加批量删除记录的ajax

            });

        },
        del: function (data) {

            console.log(data);

            //todo:在此处添加删除记录的ajax
        }
    };
    layui.use(['jquery', 'layer', 'element', 'laypage'], function () {
        window.jQuery = window.$ = layui.jquery;
        window.layer = layui.layer;
        var element = layui.element(),
            laypage = layui.laypage;


        laypage({
            cont: 'page',
            pages: count //总页数
            ,
            groups: 5 //连续显示分页数
            ,
            jump: function (obj, first) {
                //得到了当前页，用于向服务端请求对应数据
                var curr = obj.curr; // 获取当前页数下标

                if (!first) {
                    $.ajax({
                        type: "post",
                        url: "/Comment/List2?index=" + curr,
                        success: function (data) {
                            var app = new Vue({
                                el: "#app",
                                data: {
                                    persons: data
                                },
                              
                            })
                        },
                        error: function () {

                        }
                    })
                    })
                    //layer.msg('第 '+ obj.curr +' 页');
                }
            }
        });

    });
    </script>
}

